Emma Feth's profile

HCD Study Webpage Final

Study Webpage
Emma Feth
The Problem:
Switching between tabs can be annoying, especially if you are trying to study. Having materials such as a "pomodoro" timer, a planner, and a calendar can add onto this never ending clutter of study tabs for homework or exams. So, how might we help students prepare for an upcoming exam while improving work efficiency? 

From a survey with 82 responses, this is what we found from students while they study:
Hinderances:
- Procrastination
- Distractions 
- Poor time management
- Lack of planning

Preparation:
- Create a study plan
- Use online resources (Quizlet, Chegg, Grammarly, etc.)
- Join study groups
- Study Exams
Ideation:
Based on the tools that the student already has, I decided to create a webpage as a solution as an alternative to a mobile app. This webpage would allow the user to have everything they may need on a single page, instead of having multiple tabs they can have a group messager, calendar, planner, and time all on the same page. Thus, allowing users to cut down on their tabs and having everything at the same place.

Low-Fi Prototype
User Feedback:
- Users were not able to tell what the single person icon meant, when shown the “messaging board” they thought they were seeing a class schedule
- The chosen numbers for study times were not general enough, they felt like it does not match their current schedule
- Wanted more customization outside of the pink borders
Mid-Fi Prototype
Hi-Fi Prototype
Insights from Usability Testing
When implementing my user-feedback I changed the navigation bar to have text, that can be collapsed to make more space for the page. This way, the users know exactly what the features are. I also changed the icon from one person to two so it signifies more of a “group.” On top of the group messaging page I added a title so users are more understanding of the function. In addition to the planner, I took out the numbering so users can implement their own times to study.

Prototype
User Flow:
Collapse Menu, Make Menu Bigger
Select Groups from Planner
Select Settings
Change color to pink, apply
Select Groups / Planner
Select Settings
Change color to gray, apply
HCD Study Webpage Final
Published:

HCD Study Webpage Final

Published:

Creative Fields